<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./index.css">
    <link rel="stylesheet" href="./swiper-bundle.min.css">
    <script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.7.0.min.js"></script>
    <script src="./js/index.js"></script>
    <script src="./js/swiper-bundle.min.js"></script>
    
</head>

<body>
    <div class="header">
        <div class="base-box">
            <div class="left">
            <img src="./img/logo.png" alt="">
            </div>
            <div class="content">
                <div class="inputBox">
                    <input type="text" placeholder="请输入关键字搜索">
                    <img src="./img/相机.png" alt="">
                    <p>
                        <img src="./img/放大镜.png" alt="">
                    </p>
                </div>
                <div class="hotText">
                    <span class="active">鞋履上新季</span>
                    <span>Z50S PRO</span>
                    <span>时令生鲜</span>
                    <span>特邀权益</span>
                    <span>京造中秋</span>
                    <span>出游季</span>
                    <span>宠物月饼</span>
                </div>
                <div class="tab">
                    <span >京东超市</span>
                    <span>秒杀</span>
                    <span>京东家电</span>
                    <span>京东生鲜</span>
                    <span>PLUS会员</span>
                    <span>进口好物</span>
                    <span>便宜包邮</span>
                    <span>拍卖</span>
                </div>
            </div>
            <div class="logo2">
                <img src="./img/logo2.png" alt="">
            </div>
                
        </div>


    </div>
    <div class="baseBox">
        <div class="banner fCC">
            <div class="tab">
                <div>家用电器</div>
                <div>手机/运营商/数据</div>
                <div>电脑/办公</div>
                <div>家居/家具/家装/厨具</div>
                <div>男装/女装/童装/内衣</div>
                <div>美妆/个护清洁/宠物</div>
                <div>女鞋/箱包/钟表/珠宝</div>
                <div>男鞋/运动/户外</div>
                <div>房产/汽车/汽车用品</div>
                <div>母婴/玩具乐器</div>
                <div>食品/酒类/生鲜/特产</div>
                <div>食品/酒类/生鲜/特产</div>
                <div>食品/酒类/生鲜/特产</div>
                <div>食品/酒类/生鲜/特产</div>
                <div>食品/酒类/生鲜/特产</div>
                <div>食品/酒类/生鲜/特产</div>
                <div>食品/酒类/生鲜/特产</div>
                <div>食品/酒类/生鲜/特产</div>
            </div>
            <div class="imgList">
                <div class="swiper swiper1">
                    <div class="swiper-pagination"></div>
                    <div class="swiper-button-prev"> </div>
                    <div class="swiper-button-next"> </div>
                    <div class="swiper-wrapper">
                        <img class="swiper-slide" src="./img/轮播1.png"></img>
                        <img class="swiper-slide" src="./img/轮播2.jpg"></img>
                        <img class="swiper-slide" src="./img/轮播3.jpg"></img>
                        <img class="swiper-slide" src="./img/轮播4.jpg"></img>
                        <img class="swiper-slide" src="./img/轮播5.jpg"></img>
                        <img class="swiper-slide" src="./img/轮播6.jpg"></img>

                    </div>

                </div>
                <div class="swiper swiper2">
                    <div class="swiper-button-prev"> </div>
                    <div class="swiper-button-next"> </div>
                    <div class="swiper-wrapper">
                        <div class="swiper-slide" >
                            <img src="./img/1.png" alt="">
                            <img src="./img/2.png" alt="">
                            <img src="./img/3.png" alt="">
                        </div>
                        <div class="swiper-slide" >
                            <img src="./img/04.png" alt="">
                            <img src="./img/5.png" alt="">
                            <img src="./img/6.png" alt="">
                        </div>
                        <div class="swiper-slide" >
                            <img src="./img/7.png" alt="">
                            <img src="./img/8.png" alt="">
                            <img src="./img/9.png" alt="">
                        </div>
                    </div>
                </div>
            </div>
            <div class="right">
                <div class="login">
                    <div class="login-info">
                        <img src="./img/login.png" alt="">
                    </div>
                        <p>Hi~欢迎逛京东！</p>
                    <div class="btn">
                        <p>Plus会员</p>
                        <p>企业会员</p>
                    </div>
                </div>
                    
                <div class="btn-box fCC">
                    <div >
                         <img src="./img/a.png" alt="">
                          <span>企业购</span>
                    </div>
                    <div >
                        <img src="./img/b.png" alt="">
                         <span>礼品卡</span>
                    </div>
                    <div >
                        <img src="./img/c.png" alt="">
                        <span>话费</span>
                    </div>
                    <div >
                        <img src="./img/d.png" alt="">
                        <span>云建站</span>
                    </div>
                    <div >
                        <img src="./img/e.png" alt="">
                        <span>白条</span>
                    </div>
                    <div >
                        <img src="./img/f.png" alt="">
                        <span>五金城</span>
                    </div>
                    <div >
                        <img src="./img/h.png" alt="">
                        <span>火车票</span>
                    </div>
                    <div >
                        <img src="./img/i.png" alt="">
                        <span>游戏</span>
                    </div>
                    <div >
                        <img src="./img/j.png" alt="">
                        <span>加油卡</span>
                    </div>
                    <div >
                        <img src="./img/k.png" alt="">
                        <span>酒店</span>
                    </div>
                    <div >
                        <img src="./img/l.png" alt="">
                        <span>电影票</span>
                    </div>
                    <div >
                        <img src="./img/m.png" alt="">
                        <span>机票</span>
                    </div>
                </div>
                <div class="info">
                    <div class="listBox">
                        <div class="list">
                            <span class="icon">咨讯</span>
                            <span>刘文强：我国工业绿色发展取得七个方面重大成就</span>
                        </div>
                    </div>
                </div> 
            </div>    
                <div class="btnBox"></div>
        </div>

    </div>
</body>
</html>

